<!DOCTYPE html>
<html
	lang="en"
	class=""
>
	<head>
		<meta charset="utf-8" />
		<meta
			name="viewport"
			content="width=device-width, initial-scale=1.0, maximum-scale=1.0,user-scalable=0"
		/>
		<link
			rel="icon"
			href="/assets/favicon.ico"
		/>
		<link
			rel="shortcut icon"
			type="image/svg"
			href="/logo.svg"
		/>
		<link
			rel="shortcut icon"
			type="image/png"
			href="/favicon.png"
		/>

		<meta
			name="application-name"
			content="Beatbump"
		/>
		<meta
			name="msapplication-TileColor"
			content="#da532c"
		/>

		<meta
			name="og:site_name"
			content="Beatbump"
		/>

		<!-- Apple Metatags-->
		<meta
			name="apple-mobile-web-app-capable"
			content="yes"
		/>
		<meta
			name="apple-mobile-web-app-status-bar-style"
			content="black-translucent"
		/>
		<meta
			content="yes"
			name="apple-touch-fullscreen"
		/>
		<meta
			name="apple-mobile-web-app-title"
			content="Beatbump"
		/>
		<link
			rel="apple-touch-icon"
			sizes="180x180"
			href="/apple-touch-icon.png"
		/>
		<link
			rel="mask-icon"
			href="/assets/safari-pinned-tab.svg"
			color="#5bbad5"
		/>
		<link
			rel="preload"
			type="image/svg+xml"
			href="/icons.svg"
		/>
		<meta
			name="theme-color"
			content="#17171d"
		/>
		<meta
			name="apple-mobile-web-app-orientations"
			content="portrait"
		/>
		<meta
			name="apple-mobile-web-app-status-bar-style"
			content="black"
		/>

		<!-- SvelteKit tags -->
		<link
			rel="manifest"
			href="/manifest.json"
		/>

		<script>
			var parcelRequire;

			// if (!("appearance" in localStorage)) {
			// 	localStorage.theme = "Dark";
			// }
			const hasSettings = localStorage.settings;
			if (!hasSettings) document.documentElement.classList.add("Dark");
			else document.documentElement.classList.add(JSON.parse(hasSettings)?.appearance?.Theme ?? "Dark");
		</script>
		%sveltekit.head%
	</head>
	<div id="app">%sveltekit.body%</div>
</html>
